<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<div class="table-scrollable">
	<div style="margin-top: 20px;"></div>


	<div class="tabbable" id="tabs-157979">
		<ul class="nav nav-tabs">
			<li class="active"><a href="#panel-861903" data-toggle="tab">产品分类</a></li>
			<!-- <li><a href="#panel-58313" data-toggle="tab">Section 2</a></li> -->
		</ul>
		<div class="tab-content">
			<div class="tab-pane active" id="panel-861903">

				<table id="treetable"
					class="table table-striped table-hover table-info">
					<thead>
						<tr>
							<th style="text-align: left;">名称</th>
							<th style="text-align: left;">操作</th>
						</tr>
					</thead>
					<tbody>
						<c:forEach items="${productTypes }" var="productType">
							<tr<%-- id="${productType.id}" pId="${productType.parent }"  --%>>
								<td><span onclick="toggleSub(this,${productType.id})" controller="true"><c:if
											test="${productType.childCount > 0}">
											<i class="glyphicon glyphicon-chevron-right"></i>&nbsp;
										</c:if>${productType.name}</span></td>
								<td><a href="javascript:;" class="btn btn-sm blue"
									onclick="update('/productType/productType?id=${productType.id}')">
										<i class="fa fa-edit"></i>编辑
								</a><a href="javascript:;" class="btn btn-sm blue"
									onclick="add('/productType/productType?parent=${productType.id}')">
										<i class="fa fa-plus"></i>新增子分类
								</a> <a href="javascript:;" class="btn btn-sm red"
									onclick="del('/productType/delete?id=${productType.id}')">
										<i class="fa fa-trash"></i>删除
								</a></td>
							</tr>
							<c:forEach items="${productType.childList }" var="child">
								<tr class="sub${productType.id }" style="display: none;">
									<td style="padding-left: 3%"><span controller="true">${child.name}</span></td>
									<td><a href="javascript:;" class="btn btn-sm blue"
										onclick="update('/productType/productType?id=${child.id}')">
											<i class="fa fa-edit"></i>编辑
									</a><a href="javascript:;" class="btn btn-sm red"
										onclick="del('/productType/delete?id=${child.id}')"> <i
											class="fa fa-trash"></i>删除
									</a></td>
								</tr>
							</c:forEach>
						</c:forEach>
					</tbody>
				</table>

			</div>
			<div class="tab-pane" id="panel-58313">
				<p>Howdy, I'm in Section 2.</p>
			</div>
		</div>
	</div>
</div>


<script type="text/javascript">
	function toggleSub(obj,productTypeId) {
		$('.sub' + productTypeId).toggle('normal');
		if($(obj).children().attr('class') == "glyphicon glyphicon-chevron-right") {
			$(obj).children().attr("class","glyphicon glyphicon-chevron-down");
		} else {
			$(obj).children().attr("class","glyphicon glyphicon-chevron-right");
		}
	}
	/* $(function() {
		$('#treetable')
				.treeTable(
						{
							theme : 'default',
							beforeExpand : function($treeTable, id) {
								//判断id是否已经有了孩子节点，如果有了就不再加载，这样就可以起到缓存的作用
								if ($('.' + id, $treeTable).length) {
									return;
								}
								$
										.ajax({
											type : 'post',
											url : '<c:url value="/productType/treeTable"></c:url>',
											data : {
												parentId : id
											},
											dataType : 'json',
											success : function(data) {

												var rows = '';
												for (var i = 0; i < data.length; i++) {
													var hasChild = '';
													if (data[i].childNum > 0) {
														hasChild = 'hasChild="true"';
													}
													rows += '<tr id="'+data[i].id+'" pId="'+data[i].parent+'" '+hasChild+'>\n'
															+ '<td><span controller="true">'
															+ data[i].name
															+ '</span></td>\n'
															+ '<td>'
															+ data[i].code
															+ '</td>\n'
															+ '<td>\n'
															+ '<a href="javascript:;" class="btn btn-sm blue" onclick="update(\'/menu/menu?id='
															+ data[i].id
															+ '\')">'
															+ '<i class="fa fa-edit"></i>编辑</a>\n'
															+ '<a href="javascript:;" class="btn btn-sm red" onclick="del(\'/menu/delete?id='
															+ data[i].id
															+ '\')">'
															+ '<i class="fa fa-trash"></i>删除</a>\n'
															+ '</td>\n'
															+ '</tr>\n';
												}
												$treeTable.addChilds(rows);
											}
										});
							}
						}); 
	});*/
</script>